@include('Home.head')
<style type="text/css">
  .find-font-store {
    font-size: 13px;
    color: #5db95d;
  }

  #store_keyword_btn {
    width: 70px;
    height: 35px;
    margin-left: 5%;
    text-align: center;
    border: none;
    outline: none;
    border-radius: 5px;
    background: #5cb95c;
    color: #fff;
    margin-top: 1%;
  }

  #store_keyword {
    width: 72%;
    float: left;
  }

  .am-img-responsive {
    width: 100%;
    height: 100%;
  }

  @media screen and (max-width: 639px) {
    .cart-panel-ul>li {
      height: auto;
    }
  }
</style>

<body>
  <div class="container" id="app">
    <header data-am-widget="header" class="am-header am-header-default my-header">
      <div class="am-header-left am-header-nav">
        <a href="javascript:history.back(-1);" class="">
          <i class="am-header-icon am-icon-chevron-left"></i>
        </a>
      </div>
      <h1 class="am-header-title">
        <a href="#title-link" class="">@{{title}}</a>
      </h1>
      <div class="am-header-right am-header-nav">
        <a href="#right-link" class="">
          <i class="am-header-icon  am-icon-home"></i>
        </a>
      </div>
    </header>
    <div id="allmap"></div>
    <div class="paoduct-title-panel" >
      <h2 class="checkout-h2"><span class="am-badge am-round am-badge-warning ">订</span> 确认订单信息</h2>
      <div>
        <div class="cart-list-panel">
          <ul class="am-avg-sm-1 cart-panel-ul">
            <li style="display: flex">
              <div class="imgpanel"><a><img :src="order.img" class="am-img-responsive" /></a></div>
              <div class="infopanel">
                <h3><a>@{{ order.goodsname }}</a></h3>
                <p>品牌：新世界</p>
                <p>价格：<span class="red2 bold">@{{ order.price }}</span> 元 X @{{ order.number }}</p>
                <p v-show="order.specs_txt">规格：@{{ order.specs_txt }}</p>
              </div>
            </li>
          </ul>
        </div>
        <div class="cart_foot">
          总数量：<span class="red2 bold" id="total_jifen">@{{ order.number }}</span> 个，
          邮费：<span class="red2 bold" id="total_amount">@{{ freight }}</span>
          总价：<span class="red2 bold" id="total_amount">@{{ order.totalPrice }}</span>元
        </div>
      </div>
    </div>
    <div class="paoduct-title-panel">
      <h2 class="checkout-h2"><span class="am-badge am-round am-badge-warning ">2</span> 收货地址
      </h2>

      <div class="partners-title-panel">
        <div class="partners-title-panel-title" v-if="address != false" style="height: 80px;padding-left: 10px;">
          @{{ address.name }} &nbsp;@{{ address.phone }} <br>
          <a
            style="width:100%;height:49px;font-size: 12px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;">@{{ address.province }}@{{ address.city }}@{{ address.district }}@{{ address.address }}</a>
        </div>
        <div v-if="address == false">
          <p class="am-text-center" onclick="window.location.href='/home/member/address'"><button type="button"
              class="am-btn am-btn-default am-radius am-btn-block">添加收货地址</button></p>
        </div>
      </div>
    </div>
  </div>
  @include('Home.foot')
  </div>
</body>
<script>
  var app = new Vue({
    el: "#app",
    data: {
      title: '提交订单',
      order: {},
      address: {
      },
      money: {},
      status: 0,
      type: '',
      moneyCode: '',
      goon: '继续购物',
      freight: ''
    },
    methods: {
      //初始化
      initialize: function () {
        var id = this.obtain('id');
        $.post("/home/order", {
          '_token': '{{csrf_token()}}',
          class: 'find',
          id: id,
          again: 0
        }, function (res) {
          if (res.code) {
            app.order = res.data.order.OrderComment[0]
            app.freight = res.data.order.freight
            app.address = res.data.address
            app.money = res.data.moeny.data
            app.moneyCode = res.data.moeny.code
            console.log(app.order)
          } else {
            layer.msg(res.data, {
              time: 500
            }, function () {
              // window.location.href='/home/member/myoreder';
            });
          }
        });
      },

      //支付
      payBefore: function () {
        var id = this.obtain('id');
        if (id > 0) {
          if (app.address.id == undefined) {
            layer.msg('请选择收货地址');
            return false;
          }
          if (app.status == 0) {
            app.status = 1;
            layer.msg('支付中', {
              icon: 16,
              shade: 0.01
            });
            if (this.type == 'replenish') {
              $.post("/home/timeShop/order", {
                '_token': '{{csrf_token()}}',
                class: 'pay',
                id: id,
                addressId: app.address.id,
                money: app.money
              }, function (res) {
                // console.log(res)
                layer.closeAll('loading');
                if (res.code) {
                  layer.msg(res.data, {
                    time: 500
                  }, function () {
                    window.location.href = '/home/stores/index';
                  });
                } else {
                  app.status = 0;
                  layer.msg(res.data);
                }
              });
            } else {
              $.post("/home/timeShop/order", {
                '_token': '{{csrf_token()}}',
                class: 'pay',
                id: id,
                addressId: app.address.id,
                money: app.money
              }, function (res) {
                // console.log(res)
                layer.closeAll('loading');
                if (res.code) {
                  layer.msg(res.data, {
                    time: 500
                  }, function () {
                    window.location.href = '/home/stores/index';
                  });
                } else {
                  app.status = 0;
                  layer.msg(res.data);
                }
              });
            }
          } else {
            layer.msg('支付中..');
            return;
          }
        }
      },
      //获取url id
      obtain: function (val) {
        var query = window.location.search.substring(1);
        var vars = query.split("&");
        for (var i = 0; i < vars.length; i++) {
          var pair = vars[i].split("=");
          if (pair[0] == val) {
            return pair[1];
          }
        }
      },
      // 继续进货
      goPurchase: function () {
        window.location.href = '/home/timeShop/index';
      }
    },
    created() {
      this.type = this.obtain('type')
      // console.log(this.type)
    },
    //自动执行
    mounted: function () {
      this.initialize();
    },
  })
</script>

</html>